.t-i{
  text-indent: 2em;
}
.m-t-0{
  margin-top:0 !important;
}
.p-t-0{
  padding-top: 0 !important;
}
.qs-scanner-btn{
  margin: 3rem 0 4rem 0;
  .qs-scanner-down{
    padding: 0.8rem 1rem;
    background-color: #2d9afa;
    font-size: 1.5rem;
    color: #fff;
    border-radius: 5px;
    cursor: pointer;
  }
}

.qs-scanner{
  @qs-bg-gray:#fafafa;
  @qs-p-blue-color:#0daeff;
  @qs-gray:#e1e1e1;

  .row{
    margin: 0;
    .qs-scanner-row-header{
      h3{
        margin: 4.5rem 0 3.33rem 0;
        font-size: 30/12rem;
      }
      .qs-scanner-video{
        width: 75rem;
        height: 41.6667rem;
      }
    }
    .p-blue{
      color: @qs-p-blue-color;
      font-weight: bold;
      margin-bottom: 5%;
      font-size: 16/12rem;
    }
    .qs-scanner-img-p{
      padding: 5% 0;
      border-bottom: 1px solid @qs-gray;
      .qs-scanner-p{
        text-align: left;
        margin-top: 6%;
        h3{
          color: @qs-p-blue-color;
          font-weight: bold;
        }
      }
    }
    .qs-border{
      border: none;
    }
    .qs-scanner-img-p:last-child{
      border: none;
    }
  }
  .qs-bg-gray{
    background-color: @qs-bg-gray;
    padding: 5rem 0 0 0;
    .qs-bg-gray-title{
      line-height: 1.7rem;
      margin: 0 19rem;
      text-indent: 2em;
      text-align: left;
      font-size: 14/12rem;
    }
    h3{
      margin: 0 0 3.2rem 0;
    }
    h4{
      color: @qs-p-blue-color;
      font-size: 16/12rem;
      margin: 0;
      font-weight: bold;
    }
    .blue{
      color: @qs-p-blue-color;
      padding-bottom: 2rem;
      line-height: 2.2rem;
      font-size: 1rem;
    }
    p{
      line-height: 1rem;
      font-size: 14/12rem;
    }
    .qs-bg-gray-img{
      margin: 3rem 0 7rem 0;
    }
    .qs-scanner-p{
      padding-top: 30/12rem;
      text-align: left;
      font-size: 14/12rem;
      line-height: 24/12rem;
    }
    .qs-scanner-30{
      img{
        width: 30%;
      }
    }
  }
  .qs-bg-white{
    h3{
      margin: 5rem 0 3.2rem 0;
    }
    h4{
      color: @qs-p-blue-color;
      font-size: 16/12rem;
      margin: 0;
      padding-bottom: 2rem;
      font-weight: bold;
    }
    p{
      font-size: 14/12rem;
      line-height: 1.5rem;
    }
    .qs-scanner-img-lr{
      padding-bottom: 3rem;
      border-bottom: 1px solid @qs-gray;
    }
  }
  .soft-material{
    padding-bottom: 64/12rem;
  }
  .certificate{
    padding-bottom: 4rem;
    img{
      width: 70%;
    }
  }
  .qs-scanner-footer{
    .qs-scanner-p{
      p{
        text-align: left;
      }
      p:last-child{
        color: @qs-p-blue-color;
      }
    }
  }
  .qs-footer-table{
    border: none;
    font-size: 1.2rem;
    margin: 2.8rem 0 4rem 0;
    table, tr, td{
      border: none;
      text-align: left;
      padding: 5px 0;
    }
    .qs-footer-tr-blue{
      color: @qs-p-blue-color;
    }
  }
}





/*媒体查询*/
/*当页面大于1200px时，大屏幕，主要是pc端*/
@media (min-width: 1200px) {
  .qs-scanner{
    .row{
      .qs-scanner-row-header{
        .qs-scanner-img-p {
          .qs-scanner-p {
            margin-top: 6%;
          }
        }
      }
    }
  }
}
/*在992和1199像素之间的屏幕里，中等屏幕，分辨率低的pc*/
@media (min-width: 992px) and (max-width: 1199px) {
  .qs-scanner{
    .row{
      .qs-scanner-row-header{
        .qs-scanner-video{
          width: 64rem;
          height: 35rem;
        }
        .qs-scanner-img, .qs-scanner-img-footer{
          width: 75%;
        }
      }
      .qs-scanner-img-p {
        .qs-scanner-p {
          margin-top: 6%;
        }
        img{
          width: 100%;
        }
      }
    }
  }
}
/*在768和991像素之间的屏幕里，小屏幕，主要是PAD*/
@media (min-width: 768px) and (max-width: 991px){
  .qs-scanner{
    .qs-bg-gray{
      .qs-bg-gray-title{
        margin: 0;
      }
    }
    .row{
      .qs-scanner-row-header{
        .qs-scanner-video{
          width: 58rem;
          height: 33rem;
        }
        .qs-scanner-img, .qs-scanner-img-footer{
          width: 100%;
        }
      }
      .qs-scanner-img-p {
        .qs-scanner-p {
          margin-top: 6%;
        }
        img{
          width: 100%;
        }
      }
      .qs-bg-white-img{
        width: 100%;
      }
      .qs-scanner-img-lr{
        .qs-scanner-img-right{
          margin-left: 0;
        }
      }
    }
  }
}
/*在480和767像素之间的屏幕里，超小屏幕，主要用于手机*/
@media (min-width: 480px) and (max-width: 767px) {
  .qs-scanner{
    .qs-bg-gray{
      .qs-bg-gray-title{
        margin: 0;
      }
    }
    .row{
      .qs-scanner-row-header{
        .qs-scanner-video{
          width: 100%;
          height: 20rem;
        }
        .qs-scanner-img, .qs-scanner-img-footer{
          width: 100%;
        }
      }
      .qs-scanner-img-p{
        .qs-scanner-p{
          text-align: center;
          margin-top: 0;
        }
      }
    }
  }
}
/*在小于480像素的屏幕，微小屏幕，更低分辨率的手机*/
@media (max-width: 479px) {
  .qs-scanner{
    .qs-bg-gray{
      .qs-bg-gray-img, .qs-scanner-img-footer {
        width: 100%;
      }
      .qs-bg-gray-title{
        margin: 0;
      }
      img{
        width: 100%;
      }
    }
    .qs-bg-white {
      .qs-scanner-img-lr {
        .qs-scanner-img-left{
          width: 40%;
        }
        .qs-scanner-img-right{
          width: 100%;
          margin:2rem 0 0;
        }
      }
    }
    .row{
      .qs-scanner-row-header{
        //padding: 0;
        .qs-scanner-video{
          width: 100%;
          height: 20rem;
        }
        .qs-scanner-img, .qs-scanner-img-footer{
          width: 100%;
        }
      }
      .qs-scanner-img-p{
        .qs-scanner-p{
          text-align: center;
          margin-top: 0;
        }
        img{
          width: 100%;
        }
      }
      .qs-bg-white-img{
        width: 100%;
      }
    }
  }
}